<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>使用proxy实现双向绑定</h1>
    <input type="text" name="" id="input">
    <p id="text"></p>
    <script>
        let oInput = document.getElementById('input')
        let oText = document.getElementById('text')

        let obj = {}

        let newProxy = new Proxy(obj,{
            get: (target,key,recevier)=>{
                return Reflect.get(target,key,recevier)
            },
            set: (target,key,value,recevier)=>{
                if(key == 'text'){
                    oText.innerHTML = value
                }
                
                return Reflect.set(target,key,value,recevier)
            }
        })

        oInput.addEventListener('keyup',e =>{
            newProxy.text = e.target.value
        })
    </script>
</body>
</html>